<!DOCTYPE html>
<html lang="en" class="app">

<head>
    <meta charset="utf-8" />
    <title>Notebook | Web Application</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"
    />

    <link rel="stylesheet" href="/css/bootstrap.css" type="text/css"
    />
    <link rel="stylesheet" href="/css/font-awesome.min.css" type="text/css"
    />
    <link rel="stylesheet" href="/plugins/parsleyjs/parsley.css"
        type="text/css" />
    <link rel="stylesheet" href="/less/app.css" type="text/css" />
    <!--[if lt IE 9]>
    <script src="/plugins/ie/html5shiv.js"></script>
    <script src="/plugins/ie/respond.min.js"></script>
    <script src="/plugins/ie/excanvas.js"></script>
  <![endif]-->
    <style>
        .parsley-errors-list {
            margin-top: 3px;
        }
    </style>
</head>

<body>
    <section class="vbox">
        <!-- header -->
        <header class="bg-dark dk header navbar navbar-fixed-top-xs">
            <div class="navbar-header aside-md">
                <a class="btn btn-link visible-xs" data-toggle="class:nav-off-screen,open"
                    data-target="#nav,html">
                    <i class="fa fa-bars"></i>
                </a>
                <a href="#" class="navbar-brand" data-toggle="fullscreen">
                    <img src="images/logo.png" class="m-r-sm">Notebook</a>
                <a class="btn btn-link visible-xs" data-toggle="dropdown" data-target=".nav-user">
                    <i class="fa fa-cog"></i>
                </a>
            </div>
            <ul class="nav navbar-nav navbar-right m-n hidden-xs nav-user">
                <li class="dropdown">
                    <a href="#" class="dropdown-toggle" data-toggle="dropdown">
                        <span class="thumb-sm avatar pull-left">
                            <img src="images/avatar.jpg">
                        </span>
                        John.Smith
                        <b class="caret"></b>
                    </a>
                    <ul class="dropdown-menu animated fadeInRight">
                        <span class="arrow top"></span>
                        <li>
                            <a href="#">Settings</a>
                        </li>
                        <li>
                            <a href="profile.html">Profile</a>
                        </li>
                        <li>
                            <a href="#">
                                <span class="badge bg-danger pull-right">3</span>
                                Notifications
                            </a>
                        </li>
                        <li>
                            <a href="docs.html">Help</a>
                        </li>
                        <li class="divider"></li>
                        <li>
                            <a href="modal.lockme.html" data-toggle="ajaxModal">Logout</a>
                        </li>
                    </ul>
                </li>
            </ul>
        </header>

        <!-- section -->
        <section>
            <section class="hbox stretch">
                <!-- left -->
                <aside class="bg-dark lter aside-md hidden-print" id="nav">
                    <section class="vbox">
                        <section class="w-f scrollable">
                            <div class="slim-scroll" data-height="auto" data-disable-fade-out="true"
                                data-distance="0" data-size="5px"
                                data-color="#333333">
                                <nav class="nav-primary hidden-xs">
                                    <ul class="nav">
                                        <li name="salers">
                                            <a href="javascript:;">
                                                <i class="fa fa-columns icon">
                                                    <b class="bg-warning"></b>
                                                </i>
                                                <span class="pull-right">
                                                    <i class="fa fa-angle-down text"></i>
                                                    <i class="fa fa-angle-up text-active"></i>
                                                </span>
                                                <span>商家</span>
                                            </a>
                                            <ul class="nav lt">
                                                <li>
                                                    <a href="salers.html">
                                                        <i class="fa fa-angle-right"></i>
                                                        <span>商家管理</span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="redBagManage.html">
                                                        <i class="fa fa-angle-right"></i>
                                                        <span>红包管理</span>
                                                    </a>
                                                </li>
                                                <li>
                                                    <a href="djq.html">
                                                        <i class="fa fa-angle-right"></i>
                                                        <span>代金券管理</span>
                                                    </a>
                                                </li>
                                            </ul>
                                        </li>
                                        <li name="order">
                                            <a href="order.html">
                                                <i class="fa fa-pencil icon">
                                                    <b class="bg-info"></b>
                                                </i>
                                                <span>订单管理</span>
                                            </a>
                                        </li>
                                        <li name="identify">
                                            <a href="identify.html">
                                                <i class="fa fa-pencil icon">
                                                    <b class="bg-info"></b>
                                                </i>
                                                <span>认证信息</span>
                                            </a>
                                        </li>
                                        <li name="balance">
                                            <a href="balance.html">
                                                <i class="fa fa-pencil icon">
                                                    <b class="bg-primary"></b>
                                                </i>
                                                <span>余额管理</span>
                                            </a>
                                        </li>
                                    </ul>
                                </nav>
                            </div>
                        </section>

                        <!-- 缩小到侧边栏 -->
                        <footer class="footer lt hidden-xs b-t b-dark">
                            <a href="#nav" data-toggle="class:nav-xs" class="pull-right btn btn-sm btn-dark btn-icon">
                                <i class="fa fa-angle-left text"></i>
                                <i class="fa fa-angle-right text-active"></i>
                            </a>
                        </footer>
                    </section>
                </aside>
                <!-- left -->

                <section class="vbox">
                    <section class="scrollable padder">
                        <ul class="breadcrumb no-border no-radius b-b b-light pull-in">
                            <li>
                                <i class="fa fa-home"></i>首页
                            </li>
                            <li>
                                <a href="salers.html">商家管理</a>
                            </li>
                            <li>
                                <a href="redBagManage.html">红包管理</a>
                            </li>
                            <li>代金券管理</li>
                        </ul>
                        <section class="panel panel-default">
                            <header class="panel-heading bg-light">
                                <form class="form-inline queryForm gcForm">
                                    <div class="form-group">
                                        <label for="djqSearchName"> 代金券名称：</label>
                                        <input type="text" class="form-control m-r-md" id="djqSearchName">
                                        <label for="apply_start_date">起止日期：</label>
                                        <input type="text" id="apply_start_date" class="form-control"
                                            name="apply_start_date"
                                            readonly/>
                                        <label for="apply_end_date">-</label>
                                        <input type="text" id="apply_end_date" class="form-control" name="apply_end_date"
                                            readonly/>
                                    </div>
                                    <button type="submit" class="btn btn-success m-l-md">查询</button>
                                    <span class="btn btn-sm btn-rounded btn-info pull-right" data-id="0"
                                        data-type="2" data-api="voucherAdd.do?outer=djqAdd&tp=add"
                                        data-outwidth="600px"> 新增代金券</span>
                                </form>
                            </header>
                            <div class="panel-body">
                                <div data-gctable>
                                    <div>
                                        <table>
                                            <thead>
                                                <tr>
                                                    <th width="20%">代金券名称</th>
                                                    <th width="12%">规格</th>
                                                    <th width="20%">有效时间</th>
                                                    <th width="10%">已发个数</th>
                                                    <th width="10%">领取个数</th>
                                                    <th width="10%">状态</th>
                                                    <th>操作</th>
                                                </tr>
                                            </thead>
                                        </table>
                                    </div>
                                    <div class="gcBody">
                                        <table>
                                            <tbody class="gcData">
                                                <tr class="bg-white" data-id="">
                                                    <td width="20%">多个地方的郭德纲的</td>
                                                    <td width="12%">满200减100</td>
                                                    <td width="20%">2013年1月1日到2014年2月2日</td>
                                                    <td width="10%">5000</td>
                                                    <td width="10%">5000</td>
                                                    <td width="10%">使用中</td>
                                                    <td>
                                                        <div class="btn-group">
                                                            <button type="button" data-id="" data-type="2" data-api="djqDetailed.html?outer=djqDetail&tp=check"
                                                                data-outwidth="900px"
                                                                class="btn btn-sm btn-primary"
                                                                data-modal="bagCollectedDetail"
                                                                data-json='{"arRedId":111}'>查看详情</button>
                                                            <button type="button" class="btn btn-sm btn-danger" data-type="2"
                                                                data-api="authenticateRedBag.html?outer=cashDispatch&tp=check"
                                                                data-outwidth='["900px","875px"]'
                                                                data-modal="bagCollectedDetail"
                                                                data-json='{"userId":11,"arRedId":22}'>发放该代金券</button>
                                                        </div>
                                                    </td>
                                                </tr>
                                                <!-- 无数据时 -->
                                                <tr class="bg-white">
                                                    <td colspan="7">暂无数据</td>
                                                </tr>
                                            </tbody>
                                        </table>
                                    </div>
                                    <p class="gcPage">
                                        #set ($formName = "salesForm") #parse('/html/page.html')
                                    </p>
                                </div>
                            </div>
                        </section>
                    </section>
                </section>
            </section>
        </section>
    </section>

    <!--新增代金券-->
    <div class="djqAdd panel-body">
        <form class="form-horizontal" style="overflow: hidden;">
            <input type="hidden" name="userId">
            <div class="form-group">
                <label for="djqName" class="col-sm-3 control-label necessary_front">代金券名称</label>
                <div class="col-sm-9">
                    <input type="text" id="djqName" maxlength="15" name="name" class="form-control"
                        data-parsley-required data-parsley-trigger="change"
                        placeholder="至多输入15个字符" />
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label necessary_front">满减额度</label>
                <div class="col-sm-9">
                    <div class="row">
                        <div class="col-sm-1 text-center">
                            <label for="fullAmount" style="font-size:15px;margin:5px 0;">满</label>
                        </div>
                        <div class="col-sm-5">
                            <input type="text" data-parsley-type="integer" min="1" maxlength="6"
                                id="fullAmount" class="form-control"
                                name="fullAmount" data-parsley-required
                                data-parsley-trigger="change" placeholder="至多输入6个字符"
                            />
                        </div>
                        <div class="col-sm-1 text-center">
                            <label for="reduceAmount" style="font-size:15px;margin:5px 0;">减</label>
                        </div>
                        <div class="col-sm-5">
                            <input type="text" data-parsley-type="integer" min="1" maxlength="6"
                                id="reduceAmount" class="form-control"
                                name="reduceAmount" data-parsley-required
                                data-parsley-trigger="change" placeholder="至多输入6个字符"
                            />
                        </div>
                    </div>
                </div>
            </div>
            <div class="form-group">
                <label for="djqValidityStartDate" class="col-sm-3 control-label necessary_front">有效期</label>
                <div class="col-sm-9">
                    <div class="row">
                        <div class="col-sm-5">
                            <input type="text" id="djqValidityStartDate" class="form-control"
                                name="startDate" readonly data-parsley-required
                                data-parsley-trigger="change" />
                        </div>
                        <div class="col-sm-2 text-center">
                            <label for="djqValidityEndDate" style="font-size:20px;">-</label>
                        </div>
                        <div class="col-sm-5">
                            <input type="text" id="djqValidityEndDate" class="form-control"
                                name="endDate" readonly data-parsley-required
                                data-parsley-trigger="change" />
                        </div>

                    </div>
                </div>
            </div>
        </form>
    </div>

    <script src="/js/jquery.min.js"></script>
    <!-- Bootstrap -->
    <script src="/js/bootstrap.js"></script>
    <!-- App -->
    <script src="/js/app.js"></script>
    <!--引入layer-->
    <script src="/plugins/layer/layer.js"></script>
    <script src="/plugins/parsleyjs/parsley.min.js"></script>
    <script src="/plugins/parsleyjs/i18n/zh_cn.js"></script>
    <script src="/plugins/laydate/laydate.js"></script>

    <script src="/plugins/common.js"></script>
    <script>
        $(function () {
            // 查询日期设置
            setDateRange();
            setDateRange('djqValidityStartDate', 'djqValidityEndDate', laydate.now());
        });
    </script>
</body>

</html>